import 'package:flutter/material.dart';
import '../models/course.dart';
import '../utils/theme_colors.dart';

class CourseFilterSheet extends StatefulWidget {
  final CourseType? selectedType;
  final CourseDifficulty? selectedDifficulty;
  final CourseStatus? selectedStatus;
  final bool? isFree;
  final Function({
    CourseType? type,
    CourseDifficulty? difficulty,
    CourseStatus? status,
    bool? isFree,
  }) onFilterChanged;

  const CourseFilterSheet({
    Key? key,
    this.selectedType,
    this.selectedDifficulty,
    this.selectedStatus,
    this.isFree,
    required this.onFilterChanged,
  }) : super(key: key);

  @override
  State<CourseFilterSheet> createState() => _CourseFilterSheetState();
}

class _CourseFilterSheetState extends State<CourseFilterSheet> {
  CourseType? _selectedType;
  CourseDifficulty? _selectedDifficulty;
  CourseStatus? _selectedStatus;
  bool? _isFree;

  @override
  void initState() {
    super.initState();
    _selectedType = widget.selectedType;
    _selectedDifficulty = widget.selectedDifficulty;
    _selectedStatus = widget.selectedStatus;
    _isFree = widget.isFree;
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
      ),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          // 拖拽指示器
          Container(
            margin: const EdgeInsets.only(top: 12),
            width: 40,
            height: 4,
            decoration: BoxDecoration(
              color: Colors.grey[300],
              borderRadius: BorderRadius.circular(2),
            ),
          ),
          
          // 标题栏
          Padding(
            padding: const EdgeInsets.all(16),
            child: Row(
              children: [
                const Text(
                  '筛选课程',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const Spacer(),
                TextButton(
                  onPressed: _resetFilters,
                  child: Text(
                    '重置',
                    style: TextStyle(
                      color: ThemeColors.textSecondary,
                      fontSize: 14,
                    ),
                  ),
                ),
              ],
            ),
          ),
          
          const Divider(height: 1),
          
          // 筛选内容
          Flexible(
            child: SingleChildScrollView(
              padding: const EdgeInsets.all(16),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _buildCourseTypeSection(),
                  const SizedBox(height: 24),
                  _buildDifficultySection(),
                  const SizedBox(height: 24),
                  _buildStatusSection(),
                  const SizedBox(height: 24),
                  _buildPriceSection(),
                ],
              ),
            ),
          ),
          
          // 底部按钮
          Container(
            padding: const EdgeInsets.all(16),
            decoration: BoxDecoration(
              color: Colors.grey[50],
              border: Border(top: BorderSide(color: Colors.grey[200]!)),
            ),
            child: Row(
              children: [
                Expanded(
                  child: OutlinedButton(
                    onPressed: () => Navigator.pop(context),
                    style: OutlinedButton.styleFrom(
                      padding: const EdgeInsets.symmetric(vertical: 12),
                      side: BorderSide(color: ThemeColors.primary),
                    ),
                    child: Text(
                      '取消',
                      style: TextStyle(color: ThemeColors.primary),
                    ),
                  ),
                ),
                const SizedBox(width: 12),
                Expanded(
                  child: ElevatedButton(
                    onPressed: _applyFilters,
                    style: ElevatedButton.styleFrom(
                      backgroundColor: ThemeColors.primary,
                      padding: const EdgeInsets.symmetric(vertical: 12),
                    ),
                    child: const Text(
                      '确定',
                      style: TextStyle(color: Colors.white),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildCourseTypeSection() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const Text(
          '课程类型',
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
        const SizedBox(height: 12),
        Wrap(
          spacing: 8,
          runSpacing: 8,
          children: CourseType.values.map((type) {
            final isSelected = _selectedType == type;
            return GestureDetector(
              onTap: () {
                setState(() {
                  _selectedType = isSelected ? null : type;
                });
              },
              child: Container(
                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                decoration: BoxDecoration(
                  color: isSelected ? ThemeColors.primary : Colors.grey[100],
                  borderRadius: BorderRadius.circular(20),
                  border: Border.all(
                    color: isSelected ? ThemeColors.primary : Colors.grey[300]!,
                  ),
                ),
                child: Text(
                  type.displayName,
                  style: TextStyle(
                    color: isSelected ? Colors.white : ThemeColors.textPrimary,
                    fontSize: 14,
                    fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
                  ),
                ),
              ),
            );
          }).toList(),
        ),
      ],
    );
  }

  Widget _buildDifficultySection() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const Text(
          '难度等级',
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
        const SizedBox(height: 12),
        Wrap(
          spacing: 8,
          runSpacing: 8,
          children: CourseDifficulty.values.map((difficulty) {
            final isSelected = _selectedDifficulty == difficulty;
            return GestureDetector(
              onTap: () {
                setState(() {
                  _selectedDifficulty = isSelected ? null : difficulty;
                });
              },
              child: Container(
                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                decoration: BoxDecoration(
                  color: isSelected ? ThemeColors.primary : Colors.grey[100],
                  borderRadius: BorderRadius.circular(20),
                  border: Border.all(
                    color: isSelected ? ThemeColors.primary : Colors.grey[300]!,
                  ),
                ),
                child: Text(
                  difficulty.displayName,
                  style: TextStyle(
                    color: isSelected ? Colors.white : ThemeColors.textPrimary,
                    fontSize: 14,
                    fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
                  ),
                ),
              ),
            );
          }).toList(),
        ),
      ],
    );
  }

  Widget _buildStatusSection() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const Text(
          '课程状态',
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
        const SizedBox(height: 12),
        Wrap(
          spacing: 8,
          runSpacing: 8,
          children: CourseStatus.values.map((status) {
            final isSelected = _selectedStatus == status;
            return GestureDetector(
              onTap: () {
                setState(() {
                  _selectedStatus = isSelected ? null : status;
                });
              },
              child: Container(
                padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
                decoration: BoxDecoration(
                  color: isSelected ? ThemeColors.primary : Colors.grey[100],
                  borderRadius: BorderRadius.circular(20),
                  border: Border.all(
                    color: isSelected ? ThemeColors.primary : Colors.grey[300]!,
                  ),
                ),
                child: Text(
                  status.displayName,
                  style: TextStyle(
                    color: isSelected ? Colors.white : ThemeColors.textPrimary,
                    fontSize: 14,
                    fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
                  ),
                ),
              ),
            );
          }).toList(),
        ),
      ],
    );
  }

  Widget _buildPriceSection() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const Text(
          '价格类型',
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.w600,
          ),
        ),
        const SizedBox(height: 12),
        Row(
          children: [
            Expanded(
              child: GestureDetector(
                onTap: () {
                  setState(() {
                    _isFree = _isFree == true ? null : true;
                  });
                },
                child: Container(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                    color: _isFree == true ? ThemeColors.primary : Colors.grey[100],
                    borderRadius: BorderRadius.circular(8),
                    border: Border.all(
                      color: _isFree == true ? ThemeColors.primary : Colors.grey[300]!,
                    ),
                  ),
                  child: Text(
                    '免费课程',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: _isFree == true ? Colors.white : ThemeColors.textPrimary,
                      fontSize: 14,
                      fontWeight: _isFree == true ? FontWeight.w600 : FontWeight.normal,
                    ),
                  ),
                ),
              ),
            ),
            const SizedBox(width: 12),
            Expanded(
              child: GestureDetector(
                onTap: () {
                  setState(() {
                    _isFree = _isFree == false ? null : false;
                  });
                },
                child: Container(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                    color: _isFree == false ? ThemeColors.primary : Colors.grey[100],
                    borderRadius: BorderRadius.circular(8),
                    border: Border.all(
                      color: _isFree == false ? ThemeColors.primary : Colors.grey[300]!,
                    ),
                  ),
                  child: Text(
                    '付费课程',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      color: _isFree == false ? Colors.white : ThemeColors.textPrimary,
                      fontSize: 14,
                      fontWeight: _isFree == false ? FontWeight.w600 : FontWeight.normal,
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ],
    );
  }

  void _resetFilters() {
    setState(() {
      _selectedType = null;
      _selectedDifficulty = null;
      _selectedStatus = null;
      _isFree = null;
    });
  }

  void _applyFilters() {
    widget.onFilterChanged(
      type: _selectedType,
      difficulty: _selectedDifficulty,
      status: _selectedStatus,
      isFree: _isFree,
    );
    Navigator.pop(context);
  }
}